<#include "../include/header.html">
<script src="${base.contextPath}/lib/bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="${base.contextPath}/common/code?taskType=TASK.TYPE" type="text/javascript"></script>
<script type="text/javascript">
    var viewModel = Hap.createGridViewModel("#grid");
</script>
<body>

<div id="page-content">
    <span class="btn btn-primary" style="float: left;width:70px" onclick="addTask()"><@spring.message "hap.confirm"/></span>
    <div class="pull-right" id="query-form" style="padding-bottom:10px;">
        <input type="text" data-role="maskedtextbox" style="width:150px;margin-right:5px;" placeholder='<@spring.message "taskdetail.code"/>'
               data-bind="value:model.code" class="k-textbox">
        <input type="text" data-role="maskedtextbox" style="width:150px;margin-right:5px;" placeholder='<@spring.message "taskdetail.name"/>'
               data-bind="value:model.name" class="k-textbox">
        <span class="btn btn-primary" style="width:70px" data-bind="click:query" type="submit"><@spring.message "hap.query"/></span>
        <div style="clear:both"></div>
    </div>
    <script>kendo.bind($('#query-form'), viewModel);</script>
    <div style="clear:both">
        <div id="grid"></div>
    </div>
</div>

<script type="text/javascript">
    Hap.initEnterQuery('#query-form', viewModel.query);
    var BaseUrl = _basePath;
    var ids = '${RequestParameters.ids!}';
    viewModel.model.ids = ids;
    dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: BaseUrl + "/sys/task/detail/selectUnboundTasks",
                type: "POST",
                dataType: "json",
            },
            parameterMap: function (options, type) {
                if (type === "read") {
                    return Hap.prepareQueryParameter(viewModel.model.toJSON(), options)
                }
            }
        },
        batch: true,
        serverPaging: true,
        pageSize: 10,
        schema: {
            data: 'rows',
            total: 'total',
            model: {
                id: "taskId",
                fields: {
                    startDate: {type: "date"},
                    endDate: {type: 'date'},
                },
            }
        },
    });

    var grid = $("#grid").kendoGrid({
        dataSource: dataSource,
        resizable: true,
        scrollable: true,
        navigatable: false,
        selectable: 'multiple, rowbox',
        editable: false,
        pageable: {
            pageSizes: [5, 10, 20, 50],
            refresh: true,
            buttonCount: 5
        },
        columns: [
                    {
                field: "code",
                title: '<@spring.message "taskdetail.code"/>',
                width: 80
            },
                    {
                field: "name",
                title: '<@spring.message "taskdetail.name"/>',
                width: 100
            },
                    {
                field: "description",
                title: '<@spring.message "taskdetail.description"/>',
                width: 150
            },
            {
                field: "startDate",
                attributes: {style: "text-align:center"},
                title: '<@spring.message "taskdetail.starttime"/>',
                width: 100,
                headerAttributes: {style: "text-align: center"},
                format: "{0:yyyy-MM-dd}",
            },
            {
                field: "endDate",
                attributes: {style: "text-align:center"},
                title: '<@spring.message "taskdetail.endtime"/>',
                width: 100,
                headerAttributes: {style: "text-align: center"},
                format: "{0:yyyy-MM-dd}",
            },
        ],
    }).data("kendoGrid");
    
    function addTask() {
        var data = window.parent.childrenDataSource.data();
        var orders = [];
        $.each(data, function (i, v) {
            orders[i] = v.order;
        });
        var maxOrder = Math.max.apply(null, orders);
        if (maxOrder<0){
            maxOrder = 0;
        }
        var selectedData = grid.selectedDataItems();
        if (selectedData.length) {
            $.each(selectedData, function (i, v) {
                var task = {};
                task["order"] = maxOrder+i+1;
                task["code"] = v.code;
                task["name"] = v.name;
                task["description"] = v.description;
                task["startDate"] = v.startDate;
                task["endDate"] = v.endDate;
                task["taskId"] = v.taskId;
                window.parent.grid.dataSource.add(task);
            });
        }
        window.parent.grid.refresh();
        window.parent.$("#taskUnbound").data("kendoWindow").close();
    }

</script>
</body>
</html>